import path from 'path'
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import viteCompression from 'vite-plugin-compression'
import { viteMockServe } from 'vite-plugin-mock' // 报错, node需要升级到v16
// 按需自动导入 element plus组件
// 教程链接 https://www.jianshu.com/p/23229850bb08
import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'

import { resolve, dirname } from 'node:path'
import { fileURLToPath } from 'url'
// import vueI18n from '@intlify/vite-plugin-vue-i18n'  // 会报错 Could not load vue-i18n/dist/vue-i18n.runtime.mjs 官网声明不久将被启用
import VueI18nPlugin from '@intlify/unplugin-vue-i18n/vite'  // 推荐使用

// 自动导入图标组件
import Icons from 'unplugin-icons/vite'
import IconsResolver from 'unplugin-icons/resolver'

const parhSrc = path.resolve(__dirname, 'src')
export default defineConfig({
    base: '/h5-vite/',  // 开发或生产环境服务的公共基础路径
    ssr: false,
    publicDir: 'public', // 静态资源服务的文件夹。该目录中的文件在开发期间在 /h5-vite/ 处提供，并在构建期间复制到 outDir 的根目录，并且始终按原样提供或复制而无需进行转换
    minify: 'esbuild', // 构建时的压缩方式
    server: {
        host: '0.0.0.0',
        port: 8000,
        open: true, // 打开浏览器
        hmr: true,
        proxy: {
            '/api': {
                target: "https://mock.mengxuegu.com/mock/629d727e6163854a32e8307e", // easymock
                changeOrigin: true,
                rewrite: (path) => path.replace(/^\/api/, '')
            }
        }
    },
    build: {
        outDir: 'dist',
        assetsDir: 'assets',
        assetsInlineLimit: 6000, // 小于此阈值的导入或引用资源将内联为 base64 编码，以避免额外的 http 请求。
        chunkSizeWarningLimit: 1500, // 规定触发警告的 chunk 大小。
        // output: {
        //     manualChunks: {
        //         lodash: ['lodash']
        //     },
        //     entryFileNames: 'assets/[name].js',
        //     chunkFileNames: 'assets/[name].js',
        //     assetFileNames: 'assets/[name].[ext]'
        // },
        brotliSize: false, // 关闭打包时计算包的大小
        // 生产环境关闭console
        minify: 'terser', // 编译优化手段
        terserOptions: {
            compress: {
                drop_console: true,
                drop_debugger: true
            }
        }
    },
    resolve: {
    // 配置别名
        alias: {
            '@': parhSrc,
            'comps': path.resolve(__dirname, 'src/components'),
            'apis': path.resolve(__dirname, 'src/apis'),
            'views': path.resolve(__dirname, 'src/views'),
            'utils': path.resolve(__dirname, 'src/utils'),
            'routes': path.resolve(__dirname, 'src/routes'),
            'styles': path.resolve(__dirname, 'src/styles'),
            'plugins': path.resolve(__dirname, 'src/plugins'),
            'store': path.resolve(__dirname, 'src/store')
        }
    },
    plugins: [
    // vite项目所有按照插件引入
        vue(),
        viteMockServe({
            mockPath: './src/mock', // 解析
            localEnabled: true, // 开发环境使用
            prodEnabled: false, // 生产环境关闭
            watchFiles: true, // 监听文件内容变化
            injectCode:  `
            import { setupProdMockServer } from './mockProdServer';
            setupProdMockServer();
          `
        }),
        viteCompression({
            // 生成压缩包gz
            verbose: true,
            disable: false,
            threshold: 10240,
            algorithm: 'gzip',
            ext: '.gz'
        }),
        AutoImport({
            imports: ['vue'], //  vue3  setup 语法糖下 不需要导入就可以直接使用一些属性 如 ref reactive
            resolvers: [
                // 自动导入element-plus组件
                ElementPlusResolver(),
                // 1. 自动导入图标组件
                IconsResolver({
                    prefix: 'Icon' // 使用时的前缀 i-ep-
                })
            ],
            // vue常用API自定义文件生成的位置
            dts: path.resolve(parhSrc, 'auto-imports.d.ts')
        }),
        Components({
            resolvers: [
                // 自动注册element-plus组件
                ElementPlusResolver(),
                // 2.自动注册图标组件
                IconsResolver({
                    // 使用element-plus的图标库
                    enabledCollections: ['ep']
                })
            ],
            // element-plus引入组件自定义文件位置
            dts: path.resolve(parhSrc, 'components.d.ts')
        }),
        // 3. 让unplugin-icons自动安装图标库
        Icons({
            autoInstall: true
        }),
        // vueI18n({
        //     include: resolve(dirname(fileURLToPath(import.meta.url)), './src/lang/**'),
        // }),
        VueI18nPlugin({
            /* options */
            // locale messages resource pre-compile option
            include: resolve(dirname(fileURLToPath(import.meta.url)), './src/lang/**'),
        }),
    ]
})
